<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<head>
    <!-- meta tags -->
    <meta charset="utf-8">

    <!-- Title -->
    <title>首页</title>


    <!-- ui组件 -->
    <script src="/mallWeb/static/layui/layui.js"></script>
    <link href="/mallWeb/static/layui/css/layui.css" rel="stylesheet"/>
    <link href="/mallWeb/static/layui/css/modules/layer/default/layer.css" rel="stylesheet"/>
    <link href="/mallWeb/static/layui/css/modules/code.css" rel="stylesheet"/>
    <link href="/mallWeb/static/layui/css/modules/laydate/default/laydate.css" rel="stylesheet"/>

    <!-- Favicon Icon -->
    <link rel="shortcut icon" href="/mallWeb/static/images/favicon.png"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
    <!-- inject css start -->


    <link href="/mallWeb/static/css/theme-plugin.css" rel="stylesheet"/>
    <link href="/mallWeb/static/css/theme.min.css" rel="stylesheet"/>
    <link href="/mallWeb/static/css/myself.css" rel="stylesheet"/>
    <style type="text/css">
        .container_search {
            width: 590px;
            margin: 0 auto;
            padding-top: 100px;
            position: relative;
        }

        .container_search:after {
            content: '';
            display: block;
            clear: both;
        }

        .container_search > div {
            float: left;
        }

        .container_search .logo {
            width: 100%;
            height: 120px;
            margin: 0 auto 10px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: auto 120px;
        }

        .container_search .input {
            position: relative;
            width: 500px;
            height: 44px;
            border-top: #ccc solid 1px;
            border-right: none;
            border-bottom: #ccc solid 1px;
            border-left: #ccc solid 1px;
            border-radius: 4px 0 0 4px;
        }

        .container_search .input > input {
            outline: none;
            border: none;
            padding: 0 80px 0 10px;
            margin: 0;
            height: 40px;
            width: 410px;
            color: #333;
            font-size: 16px;
            border-radius: 4px 0 0 4px;
        }

        .container_search .input > input::-webkit-input-placeholder {
            color: #999;
        }

        .container_search .input .picker {
            width: 40px;
            padding-right: 30px;
            position: absolute;
            top: 0;
            right: 0;
            height: 100%;
            line-height: 44px;
            cursor: pointer;
            color: #999;
            font-size: 12px;
            text-align: right;
            background-image: url("/mallWeb/static/images/down.png");
            background-position: 50px center;
            background-repeat: no-repeat;
            user-select: none;
        }

        .container_search .input .picker-list {
            list-style: none;
            padding: 5px 0;
            width: 100px;
            position: absolute;
            right: 0;
            top: 50px;
            margin: 0;
            line-height: 26px;
            font-size: 12px;
            border-radius: 2px;
            box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
            background-color: #fff;
            display: none;
        }

        .container_search .input .picker-list > li {
            padding-left: 36px;
            background-position: 10px center;
            background-repeat: no-repeat;
            background-size: 16px auto;
        }

        .container_search .input .picker-list > li:hover {
            background-color: #ebf1f5;
            cursor: pointer;
        }

        .container_search .input .hot-list {
            padding: 10px 0;
            width: 100%;
            position: absolute;
            left: 0;
            top: 50px;
            margin: 0;
            line-height: 32px;
            font-size: 14px;
            border-radius: 2px;
            box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
            background-color: #fff;
            display: none;
        }

        .container_search .input .hot-list > a {
            display: block;
            color: #333;
            text-decoration: none;
            padding: 0 10px;
            overflow: hidden;
        }

        .container_search .input .hot-list > a:hover {
            background-color: #f3f3f3;
        }

        .container_search .input .hot-list > a > div {
            float: left;
        }

        .container_search .input .hot-list > a > div.number {
            text-align: center;
            width: 40px;
        }

        .container_search .search {
            width: 89px;
            height: 46px;
            background-color: #08f;
            background-image: url("/mallWeb/static/images/search.png");
            background-position: center;
            background-repeat: no-repeat;
            border-radius: 0 4px 4px 0;
            cursor: pointer;
        }
    </style>
    <!-- inject css end -->
    <style>
        .Personal_center {
            position: relative;
            display: inline-block;
            width: 30px;
            height: 30px;
            margin: auto auto auto auto;
            border: 0px solid #6a89cc;
            border-radius: 50%;
        }

        .Personal_center img {
            position: absolute;
            width: 30px;
            height: 30px;
            margin-right: 0.5rem;
            border-radius: 50%;
            overflow: hidden;
        }

        .drop_option {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            padding: 12px 10px;
        }

        .Personal_center:hover .drop_option {
            display: block;
        }
    </style>
</head>

<body>

<!-- page wrapper start -->

<div class="page-wrapper">

    <!-- preloader start -->

    <div id="ht-preloader">
        <div class="loader clear-loader"><img class="img-fluid" src="/mallWeb/static/images/loader.gif" alt=""></div>
    </div>

    <!-- preloader end -->

    <header class="site-header header-1">
        <div class="header-top bg-dark-1 py-0">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-12 d-flex align-items-center justify-content-between text-white">
                        <div class="d-none d-md-flex align-items-center call-info">
                            <div class="d-flex align-items-center">
                                <div class="text-white offer-text"><small><img
                                        src="/mallWeb/static/images/share/shopping.png" width="30" height="30">
                                    欢迎来到校园易货网 </small></div>
                                <div class="language-selection">
                                    <div class="d-flex align-items-center justify-content-center justify-content-md-end">
                                        <div class="ml-3 mr-3">
                                        </div>
                                        <div class="lng_dropdown">
                                            <select name="countries" class="custome_select">
                                                <option value='en' data-image="/mallWeb/static/images/share/ZYNC.jpg"
                                                        data-title="ZYNC">遵义师范学院
                                                </option>
                                                <option value='fn' data-image="/mallWeb/static/images/share/ZYNU.jpg"
                                                        data-title="ZYNU">遵义医科大学
                                                </option>
                                                <option value='us'
                                                        data-image="/mallWeb/static/images/share/OtherSchool.png"
                                                        data-title="Other School">其他学校
                                                </option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="d-flex align-items-center">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="header-wrap">
            <div class="container">
                <div class="row">
                    <!--menu start-->
                    <div class="col">
                        <nav class="navbar navbar-expand-lg navbar-light position-static"><a class="navbar-brand logo"
                                                                                             href="index.html"> <img
                                class="img-fluid" src="/mallWeb/static/images/share/zync.png" width="180" height="80">
                        </a>
                            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
                                    aria-expanded="false" aria-label="Toggle navigation"><span
                                    class="navbar-toggler-icon"></span></button>
                            <div class="collapse navbar-collapse" id="navbarNav">
                                <ul class="navbar-nav ml-auto mr-auto">
                                    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle active"
                                                                     href="${pageContext.request.contextPath}/index-2">首页</a>
                                    </li>
                                    <li class="nav-item dropdown position-static"><a class="nav-link dropdown-toggle"
                                                                                     href="${pageContext.request.contextPath}/autotrophy-2">自营</a>
                                        <div class="dropdown-menu w-100">
                                            <!-- Tabs -->
                                            <div class="container p-0">
                                                <div class="row w-100 no-gutters">
                                                    <div class="col-lg-8 p-lg-3">
                                                        <div class="row">
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">服装男</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=长袖">长袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=短袖">短袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=外套">外套</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=羽绒服">羽绒服</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=牛仔库">牛仔裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=牛仔衣">牛仔衣</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=短裤">短裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=绒裤">绒裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=运动裤">运动库</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=男装&classify=其它">其它</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">女装</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=长袖">长袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=短袖">短袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=外套">外套</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=羽绒服">羽绒服</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=牛仔裤">牛仔裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=牛仔衣">牛仔衣</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=短裤">短裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=绒裤">绒裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=运动裤">运动裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=女装&classify=其它">其它</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">手机</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=华为">华为</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=华为">小米</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=苹果">苹果</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=一加">一加</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=魅族">魅族</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=OPPO">OPPO</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=VIVO">VIVO</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=三星">三星</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=努比亚">努比亚</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=手机&classify=其它">其它</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">图书</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-0">
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=小说">小说</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=儿童读物">儿童读物</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=漫画">漫画</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=期刊">期刊</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=杂志">杂志</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=计算机技术">计算机技术</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=农业科学">农业科学</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=中国文学">中国文学</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=书法篆刻">书法篆刻</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-auto?requestName=图书&classify=经典读物">经典读物</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-4 d-none d-lg-block pr-2"><img
                                                            class="img-fluid rounded-bottom rounded-top"
                                                            src="/mallWeb/static/images/header-img.jpg" alt="..."></div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="nav-item dropdown position-static"><a class="nav-link dropdown-toggle"
                                                                                     href="${pageContext.request.contextPath}/idle-goods-2">闲置商品</a>
                                        <div class="dropdown-menu w-100">
                                            <!-- Tabs -->
                                            <div class="container p-0">
                                                <div class="row w-100 no-gutters">
                                                    <div class="col-lg-8 p-lg-3">
                                                        <div class="row">
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">服装男</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=长袖">长袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=短袖">短袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=外套">外套</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=羽绒服">羽绒服</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=牛仔库">牛仔裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=牛仔衣">牛仔衣</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=短裤">短裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=绒裤">绒裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=运动裤">运动库</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=男装&classify=其它">其它</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">女装</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=长袖">长袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=短袖">短袖</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=外套">外套</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=羽绒服">羽绒服</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=牛仔裤">牛仔裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=牛仔衣">牛仔衣</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=短裤">短裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=绒裤">绒裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=运动裤">运动裤</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=女装&classify=其它">其它</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">手机</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=华为">华为</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=华为">小米</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=苹果">苹果</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=一加">一加</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=魅族">魅族</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=OPPO">OPPO</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=VIVO">VIVO</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=三星">三星</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=努比亚">努比亚</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=手机&classify=其它">其它</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">图书</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-0">
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=小说">小说</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idlerequestName=图书&classify=儿童读物">儿童读物</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=漫画">漫画</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=期刊">期刊</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=杂志">杂志</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=计算机技术">计算机技术</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=农业科学">农业科学</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=中国文学">中国文学</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=书法篆刻">书法篆刻</a>
                                                                    </li>
                                                                    <li>
                                                                        <a href="showClassify-idle?requestName=图书&classify=经典读物">经典读物</a>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-4 d-none d-lg-block pr-2"><img
                                                            class="img-fluid rounded-bottom rounded-top"
                                                            src="/mallWeb/static/images/header-img.jpg" alt="..."></div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle"
                                                                     href="${pageContext.request.contextPath}/blog-2">博客</a>
                                    </li>
                                    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle"
                                                                     href="javascript:void(0)" data-toggle="dropdown">发布闲置</a>
                                        <ul class="dropdown-menu">
                                            <li><a href="${pageContext.request.contextPath}/publish-book">发布图书</a></li>
                                            <li><a href="${pageContext.request.contextPath}/publish-phone">发布手机</a></li>
                                            <li><a href="${pageContext.request.contextPath}/publish-clothing">发布衣服</a>
                                            </li>
                                            <li><a href="${pageContext.request.contextPath}/publish-other">其它</a></li>
                                        </ul>
                                    </li>

                                    <li class="nav-item"><a class="nav-link"
                                                            href="${pageContext.request.contextPath}/about-us-2">关于我们</a>
                                    </li>
                                </ul>
                            </div>
                            <div class="right-nav align-items-center d-flex justify-content-end">
                                <div class="mr-1 mr-sm-3 search-block">
                                    <a href="javascript:void(0);" class="search_trigger ml-3"><i
                                            class="las la-search"></i></a>
                                    <div style="width: 900px" class="search_wrap container">
											<span style="margin-top: " class="close-search"><i
                                                    class="ion-ios-close-empty"></i></span>
                                        <form name="submited">
                                            <div class="container_search"
                                                 style="box-sizing: border-box; padding-top: 10px">
                                                <div class="input" style="padding-top: 0px;padding-bottom: 0px;">
                                                    <input type="text" placeholder="请输入要搜索的内容"
                                                           style="border-bottom-color: #cccccc" autocomplete="off"
                                                           id="search-input">
                                                    <c:forEach items="${key }" var="key">
                                                        <input type="hidden" class="pickListModels"
                                                               value="${key }"/>
                                                    </c:forEach>
                                                    <div class="picker" style="width: 80px;">商品</div>
                                                    <ul class="picker-list" style="width: 70px;">
                                                        <li data-logo=""
                                                            style="padding-right: 0px; width: 68px; padding-left: 18px;">
                                                            商品
                                                        </li>
                                                        <li data-logo=""
                                                            style="padding-right: 0px; width: 68px; padding-left: 18px;">
                                                            店铺
                                                        </li>
                                                        <li data-logo=""
                                                            style="padding-right: 0px; width: 68px; padding-left: 18px;">
                                                            用户
                                                        </li>
                                                        <li data-logo=""
                                                            style="padding-right: 0px; width: 68px; padding-left: 18px;">
                                                            博客
                                                        </li>
                                                    </ul>
                                                    <div class="hot-list"></div>
                                                </div>
                                                <div class="search"></div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                                <!--  --> <a class="mr-3 d-none d-sm-inline" href="#"><i class="lar la-heart"></i></a>
                                <!-- 点击购物车 -->
                                <div class="dropdown cart_dropdown"><a class="d-flex align-items-center" href="#"> <span
                                        class="bg-white pr-2 pl-0 py-1 rounded" data-cart-items="2"> <i
                                        class="las la-shopping-bag"></i> </span> </a>
                                    <!-- <div class="cart_box dropdown-menu dropdown-menu-right">
                       <ul class="cart_list">
                       前一个是删除按钮，后一个才是商品详情
                         <li> <a href="浮动购物单" class="item_remove"><i class="ion-ios-close-empty"></i></a> <a href="#"><img src="/mallWeb/static/images/product/p8.jpg" alt="cart_thumb1">鞋子</a> <span class="cart_quantity"> 1 x <span class="cart_amount"> <span class="price_symbole">$</span></span>78.00</span> </li>
                         <li> <a href="#" class="item_remove"><i class="ion-ios-close-empty"></i></a> <a href="#"><img src="/mallWeb/static/images/product/p12.jpg" alt="cart_thumb2">衣服</a> <span class="cart_quantity"> 1 x <span class="cart_amount"> <span class="price_symbole">$</span></span>81.00</span> </li>
                       </ul>
                       <div class="cart_footer">
                         <p class="cart_total"><strong>总计:</strong> <span class="cart_price"> <span class="price_symbole">$</span></span>159.00</p>
                         <p class="cart_buttons"><a href="#" class="btn btn-secondary view-cart ml-2 mr-2">进入购物车</a><a href="#" class="btn btn-primary ml-2 mr-2 checkout">立即购买</a></p>
                       </div>
                     </div> -->
                                </div>
                            </div>
                        </nav>
                    </div>
                    <div class="dropdown">
			<span class="glyphicon ">
				<a href="${pageContext.request.contextPath}/personnal" class="vue-photo">
				<img style="width: 30px; height: 30px; margin: 15 25 10 0; margin-top:15px"
                     src="/mallWeb/static/images/about/01.jpg"></a>
			</span>
                        <div class="dropdown-content">
                            <p><a href="${pageContext.request.contextPath}/personal"><font
                                    color="#f86868">个人中心</font></a></p>
                            <p><a href="${pageContext.request.contextPath}/drop"><font color="#445a69">注销退出</font></a>
                            </p>
                            <p><a href="${pageContext.request.contextPath}/change"><font color="#445a69">切换账号</font></a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <!--header end-->


    <!--hero section start-->

    <section class="bg-light py-6">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-md-6">
                    <h1 class="h2 mb-0">商品详情</h1>
                </div>
                <div class="col-md-6 mt-3 mt-md-0">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb justify-content-md-end bg-transparent p-0 m-0">
                            <li class="breadcrumb-item"><a class="link-title" href="privacy-policy-1">隐私政策</a>
                            </li>
                            <li class="breadcrumb-item"><a class="link-title" href="terms-and-conditions-1">条规&条款</a>
                            </li>
                            <li class="breadcrumb-item active text-primary" aria-current="page"><a href="contact-us-2">
                                联系我们</a></li>
                        </ol>
                    </nav>
                </div>
            </div>
            <!-- / .row -->
        </div>
        <!-- / .container -->
    </section>

    <!--hero section end-->


    <!--body content start-->

    <div class="page-content">

        <!--product details start-->

        <section>
            <div class="container">
                <div class="row">
                    <div class="col-lg-6 col-12">
                        <div class="product-image">
                            <!-- 大头图 -->
                            <div class="product_img_box">
                                <img id="product_img" src='showPhoto?requestName=url1&url1=${detail.goods_url1 }'
                                     data-zoom-image="showPhoto?requestName=url1&url1=${detail.goods_url1 }"
                                     alt="product_img1"/>
                                <a href="#" class="product_img_zoom" title="Zoom">
                                    <span class="linearicons-zoom-in"></span>
                                </a>
                            </div>
                            <!-- 第一张 -->
                            <c:if test="${detail.goods_url2 !=null }">
                            <div id="pr_item_gallery" class="product_gallery_item slick_slider no-pb owl-carousel owl-2"
                                 data-dots="false" data-nav="false" data-items="5" data-md-items="2" data-sm-items="1">
                                <div class="item">
                                    <a href="#" class="product_gallery_item active"
                                       data-image="showPhoto?requestName=url1&url1=${detail.goods_url1 }"
                                       data-zoom-image="showPhoto?requestName=url1&url1=${detail.goods_url1 }">
                                        <img src="showPhoto?requestName=url1&url1=${detail.goods_url1 }"
                                             alt="product_small_img1"/>
                                    </a>
                                </div>
                                </c:if>
                                <!-- 第二张 -->
                                <c:if test="${detail.goods_url2 !=null }">
                                    <div class="item">
                                        <a href="#" class="product_gallery_item"
                                           data-image="showPhoto?requestName=url2&url2=${detail.goods_url2 }"
                                           data-zoom-image="showPhoto?requestName=url2&url2=${detail.goods_url2 }">
                                            <img src="showPhoto?requestName=url2&url2=${detail.goods_url2 }"
                                                 alt="product_small_img3"/>
                                        </a>
                                    </div>
                                </c:if>
                                <!-- 第三张 -->
                                <c:if test="${detail.goods_url3 !=null }">
                                    <div class="item">
                                        <a href="#" class="product_gallery_item"
                                           data-image="showPhoto?requestName=url3&url3=${detail.goods_url3 }"
                                           data-zoom-image="showPhoto?requestName=url3&url3=${detail.goods_url3 }">
                                            <img src="showPhoto?requestName=url3&url3=${detail.goods_url3 }"
                                                 alt="product_small_img2"/>
                                        </a>
                                    </div>
                                </c:if>
                                <!-- 第四张 -->
                                <c:if test="${detail.goods_url4 !=null }">
                                    <div class="item">
                                        <a href="#" class="product_gallery_item"
                                           data-image="showPhoto?requestName=url4&url4=${detail.goods_url4 }"
                                           data-zoom-image="showPhoto?requestName=url4&url4=${detail.goods_url4 }">
                                            <img src="showPhoto?requestName=url4&url4=${detail.goods_url4 }"
                                                 alt="product_small_img4"/>
                                        </a>
                                    </div>
                                </c:if>
                                <!-- 第五张 -->
                                <c:if test="${detail.goods_url5 !=null }">
                                    <div class="item">
                                        <a href="#" class="product_gallery_item"
                                           data-image="showPhoto?requestName=url5&url5=${detail.goods_url5 }"
                                           data-zoom-image="showPhoto?requestName=url5&url5=${detail.goods_url5 }">
                                            <img src="showPhoto?requestName=url5&url5=${detail.goods_url5 }"
                                                 alt="product_small_img4"/>
                                        </a>
                                    </div>
                                </c:if>
                                <!-- 第六张 -->
                                <c:if test="${detail.goods_url6 !=null }">
                                    <div class="item">
                                        <a href="#" class="product_gallery_item"
                                           data-image="showPhoto?requestName=url6&url6=${detail.goods_url6 }"
                                           data-zoom-image="showPhoto?requestName=url6&url6=${detail.goods_url6 }">
                                            <img src="showPhoto?requestName=url6&url6=${detail.goods_url6 }"
                                                 alt="product_small_img4"/>
                                        </a>
                                    </div>
                                </c:if>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-12 mt-5 mt-lg-0">
                        <div class="product-details">
                            <h1 class="h4 mb-0 font-w-6">${detail.goods_name }</h1>
                            <div class="star-rating mb-5"><i class="las la-star"></i><i class="las la-star"></i><i
                                    class="las la-star"></i><i class="las la-star"></i><i class="las la-star"></i>
                            </div>
                            <span class="product-price h5 text-pink">¥${detail.goods_D_price } <del
                                    class="text-muted h6">¥${detail.goods_Y_price }</del></span>
                            <p class="mb-5 border-top border-bottom pb-5 pt-5 desc">${detail.goods_detail }</p>
                            <ul class="list-unstyled my-5">
                                <li class="font-w-4"><small class="text-muted">手机品牌：
                                    <button class="layui-btn layui-btn-primary"> ${detail.goods_classify }</button>
                                </small>
                                </li>
                                <li class="font-w-4"><small class="text-muted">手机颜色 ：
                                    <button class="layui-btn layui-btn-primary"> ${detail.goods_type }</button>
                                </small>
                                </li>
                                <li class="font-w-4"><small class="text-muted">交易方式 ：
                                    <button class="layui-btn layui-btn-primary"> ${detail.mode }</button>
                                </small>
                                </li>
                                <li><small class="text-muted">手机内存：
                                    <button class="layui-btn layui-btn-primary"> ${detail.goods_size }</button>
                                </small>
                                </li>
                            </ul>
                            <div class="d-sm-flex align-items-center mb-5">
                                <div class="d-flex align-items-center mr-sm-4">
                                    <button class="btn-product btn-product-up"><i class="las la-minus"></i>
                                    </button>
                                    <input class="form-product" type="number" name="form-product" value="1">
                                    <button class="btn-product btn-product-down"><i class="las la-plus"></i>
                                    </button>
                                </div>
                                <select class="custom-select mt-3 mt-sm-0" id="inputGroupSelect02">
                                    <option value="货到付款" selected>支付方式</option>
                                    <option value="货到付款">货到付款</option>
                                    <option value="线上支付">线上支付</option>
                                    <option value="其他方式">其他方式</option>
                                </select>
                                <div class="d-flex text-center ml-sm-4 mt-3 mt-sm-0">
                                    <div class="form-check pl-0 mr-2">

                                    </div>
                                </div>
                            </div>

                            <div class="d-sm-flex align-items-center mt-5">
                                <button class="btn btn-primary btn-animated mr-sm-3 mb-3 mb-sm-0"><i
                                        class="las la-shopping-cart mr-2"></i>加入购物车
                                </button>
                                <a class="btn btn-animated btn-dark" href="#"> <i class="lar la-heart mr-2 ic-1-2x"></i>立即购买
                                </a>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!--product details end-->


        <!--tab start-->

        <section class="pt-0 pb-8">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="tab product-tab">
                            <!-- Nav tabs -->
                            <nav>
                                <div class="nav nav-tabs" id="nav-tab" role="tablist"><a
                                        class="nav-item nav-link active ml-0" id="nav-tab1" data-toggle="tab"
                                        href="#tab3-1" role="tab" aria-selected="true">商品介绍</a>
                                    <a class="nav-item nav-link" id="nav-tab2" data-toggle="tab" href="#tab3-2"
                                       role="tab" aria-selected="false">规格</a>
                                    <a class="nav-item nav-link" id="nav-tab3" data-toggle="tab" href="#tab3-3"
                                       role="tab" aria-selected="false">留言</a>
                                </div>
                            </nav>
                            <!-- Tab panes -->
                            <div class="tab-content pt-5 p-0">
                                <div role="tabpanel" class="tab-pane fade show active" id="tab3-1">
                                    <div class="row align-items-center">

                                        <div class="col-md-12">
                                            <p></p>
                                            <p>${detail.goods_detail }</p>
                                        </div>
                                    </div>
                                </div>
                                <div role="tabpanel" class="tab-pane fade show" id="tab3-2">
                                    <table class="table table-bordered mb-0">
                                        <tbody>
                                        <tr>
                                            <td>手机品牌</td>
                                            <td>${detail.goods_classify }</td>
                                        </tr>
                                        <tr>
                                            <td>手机颜色</td>
                                            <td>${detail.goods_type }</td>
                                        </tr>
                                        <tr>
                                            <td>手机内存</td>
                                            <td>${detail.goods_size }</td>
                                        </tr>
                                        <tr>
                                            <td>配送学校</td>
                                            <td>${detail.distribute_school }</td>
                                        </tr>
                                        <tr>
                                            <td>方式</td>
                                            <td>${detail.mode }</td>
                                        </tr>
                                        <tr>
                                            <td>售后</td>
                                            <td>当天无理由退换</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div role="tabpanel" class="tab-pane fade show" id="tab3-3">
                                    <div class="comment-area mt-5">
                                        <div class="content_title">
                                            <h4>留言</h4>
                                        </div>
                                        <ul id="comment_control2" class="list_none comment_list">
                                            <div id="comment_control">
                                                <c:forEach items="${comment }" var="comment">
                                                <!-- 父评论 -->
                                                <div id="a${comment.code }">
                                                    <li class="comment_info">
                                                        <div class="d-flex">
                                                            <div class="comment_user">
                                                                <img style="height: 35px;width: 35px"
                                                                     src="/mallWeb/static/images/thumbnail/member3.png"
                                                                     alt="user4">
                                                            </div>
                                                            <div class="comment_content">
                                                                <div class="d-flex">
                                                                    <div class="meta_data">
                                                                        <h6><a href="#">${comment.from_user_name} </a>
                                                                        </h6>
                                                                        <div class="comment-time">${comment.date }</div>
                                                                    </div>
                                                                    <div class="ml-auto">
                                                                        <a href="javascript:void(0);"
                                                                           value="${comment.parent_id } ${comment.from_user_id } ${comment.goods_id } ${comment.code} ${parentLast.code } ${comment.from_user_name}"
                                                                           class="comment-reply2">
                                                                            <button style="margin-left: 850px; type="
                                                                                    button
                                                                            " class="btn btn-danger" data-toggle="modal"
                                                                            data-target="#exampleModal"
                                                                            data-whatever="@mdo">回复</button></a>
                                                                    </div>
                                                                </div>
                                                                <p>${comment.content }</p>
                                                            </div>
                                                        </div>
                                                        <br>
                                                        <div style="margin-left: 55px; class=" ml-auto
                                                        ">
                                                        <a class="text-red delete" href="javascript:void(0);"
                                                           value="${comment.code} ${comment.from_user_id} ${comment.parent_id}">删除</a>
                                                </div>

                                                <div class="read_more ${comment.code }">
                                                    <c:if test="${comment.childMsg.size()-1 != 0 }">
                                                        <a href="javascript:void(0);"
                                                           value="${comment.code } ${comment.parent_id}"><span
                                                                style="margin-left: 1000px"
                                                                class="text-muted muted c${comment.code }">展开${comment.childMsg.size()-1 }条回复<i
                                                                class="bi bi-chevron-down"></i></span></a>
                                                    </c:if>
                                                </div>
                                                <ul id="${comment.code }" class="children" style="display: none">
                                                    <div id="b${comment.code }">
                                                        <!-- 子评论 -->
                                                    </div>
                                                </ul>
                                                </li>
                                            </div>
                                            <hr>
                                            </c:forEach>
                                    </div>
                                    </ul>


                                    <div class="mt-8 bg-light-4 rounded p-5">
                                        <div class="section-title mb-3">
                                            <h4>留言</h4>
                                        </div>
                                        <div class="messages"></div>
                                        <form id="isValidator1" method="post">
                                            <div class="form-group col-12">
                                                <textarea id="form_message" name="message" class="form-control"
                                                          placeholder="感觉怎么样？跟大家分享一下吧!" rows="4" required
                                                          data-error="内容不能为空，请输入您的留言"></textarea>
                                                <div class="help-block with-errors"></div>
                                            </div>
                                            <div class="col-12">
                                                <a href="javascript:void(0);"
                                                   value="${detail.user_id } ${detail.goods_id } ${parentLast.code}"
                                                   class="comment-reply1">
                                                    <input type="submit" class="btn btn-primary btn-animated mt-1"
                                                           value="提交留言">
                                                </a>

                                            </div>
                                        </form>
                                    </div>
                                    <div></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
    </div>
    </section>

    <!--tab end-->

    <!--recent product start-->

    <section class="pb-6 border-top pt-7">
        <div class="container">
            <div class="row justify-content-center text-center">
                <div class="col-lg-8 col-md-10">
                    <div class="mb-5">
                        <h2 class="mb-0 font-w-6">为您推荐</h2>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="owl-carousel no-pb owl-2" data-dots="false" data-nav="true" data-items="4"
                         data-md-items="2" data-sm-items="1">
                        <div class="item">
                            <div class="card product-card card--default"><a class="card-img-hover d-block"
                                                                            href="product-left-image.html"> <img
                                    class="card-img-top card-img-back" src="/mallWeb/static/images/product/p2.jpg"
                                    alt="..."> <img class="card-img-top card-img-front"
                                                    src="/mallWeb/static/images/product/p2_hover.jpg" alt="..."> </a>
                                <div class="card-icons">
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="加入收藏"> <i
                                            class="lar la-heart"></i> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="快速查看"><span
                                            data-target="#quick-view" data-toggle="modal"> <i
                                            class="ion-ios-search-strong"></i></span> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="Compare"> <i
                                            class="las la-random"></i> </a></div>
                                </div>
                                <div class="card-info">
                                    <div class="card-body">
                                        <div class="product-title font-w-5"><a class="link-title"
                                                                               href="product-left-image.html">Trust The
                                            Process</a></div>
                                        <div class="mt-1"><span class="product-price text-pink"><del class="text-muted"> ¥35.00</del> ¥25.00</span>
                                            <div class="star-rating"><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i></div>
                                        </div>
                                    </div>
                                    <div class="card-footer bg-transparent border-0">
                                        <div class="product-link d-flex align-items-center justify-content-center">
                                            <button class="btn-cart btn btn-pink mx-3" type="button"><i
                                                    class="las la-shopping-cart mr-1"></i> 加入购物车
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="card product-card card--default"><a class="card-img-hover d-block"
                                                                            href="product-left-image.html"> <img
                                    class="card-img-top card-img-back" src="/mallWeb/static/images/product/p11.jpg"
                                    alt="..."> <img class="card-img-top card-img-front"
                                                    src="/mallWeb/static/images/product/p11_hover.jpg" alt="..."> </a>
                                <div class="card-icons">
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="加入收藏"> <i
                                            class="lar la-heart"></i> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="快去查看"><span
                                            data-target="#quick-view" data-toggle="modal"> <i
                                            class="ion-ios-search-strong"></i></span> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="Compare"> <i
                                            class="las la-random"></i> </a></div>
                                </div>
                                <div class="card-info">
                                    <div class="card-body">
                                        <div class="product-title font-w-5"><a class="link-title"
                                                                               href="product-left-image.html">Trust The
                                            Process</a></div>
                                        <div class="mt-1"><span class="product-price text-pink"><del class="text-muted">¥129.00</del> ¥120.00</span>
                                            <div class="star-rating"><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i></div>
                                        </div>
                                    </div>
                                    <div class="card-footer bg-transparent border-0">
                                        <div class="product-link d-flex align-items-center justify-content-center">
                                            <button class="btn-cart btn btn-pink mx-3" type="button"><i
                                                    class="las la-shopping-cart mr-1"></i> 加入购物车
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="card product-card card--default"><a class="card-img-hover d-block"
                                                                            href="product-left-image.html"> <img
                                    class="card-img-top card-img-back" src="/mallWeb/static/images/product/p15.jpg"
                                    alt="..."> <img class="card-img-top card-img-front"
                                                    src="/mallWeb/static/images/product/p15_hover.jpg" alt="..."> </a>
                                <div class="card-icons">
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="加入收藏"> <i
                                            class="lar la-heart"></i> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="快速查看"><span
                                            data-target="#quick-view" data-toggle="modal"> <i
                                            class="ion-ios-search-strong"></i></span> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="Compare"> <i
                                            class="las la-random"></i> </a></div>
                                </div>
                                <div class="card-info">
                                    <div class="card-body">
                                        <div class="product-title font-w-5"><a class="link-title"
                                                                               href="product-left-image.html">Trust The
                                            Process</a></div>
                                        <div class="mt-1"><span class="product-price text-pink"><del class="text-muted">¥99.00</del> ¥88.00</span>
                                            <div class="star-rating"><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i></div>
                                        </div>
                                    </div>
                                    <div class="card-footer bg-transparent border-0">
                                        <div class="product-link d-flex align-items-center justify-content-center">
                                            <button class="btn-cart btn btn-pink mx-3" type="button"><i
                                                    class="las la-shopping-cart mr-1"></i> 加入购物车
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="card product-card card--default">
                                <div class="hot-label">热销</div>
                                <a class="card-img-hover d-block" href="product-left-image.html"> <img
                                        class="card-img-top card-img-back" src="/mallWeb/static/images/product/p5.jpg"
                                        alt="..."> <img class="card-img-top card-img-front"
                                                        src="/mallWeb/static/images/product/p5_hover.jpg" alt="...">
                                </a>
                                <div class="card-icons">
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="加入收藏"> <i
                                            class="lar la-heart"></i> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="快速查看"><span
                                            data-target="#quick-view" data-toggle="modal"> <i
                                            class="ion-ios-search-strong"></i></span> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="Compare"> <i
                                            class="las la-random"></i> </a></div>
                                </div>
                                <div class="card-info">
                                    <div class="card-body">
                                        <div class="product-title font-w-5"><a class="link-title"
                                                                               href="product-left-image.html">Trust The
                                            Process</a></div>
                                        <div class="mt-1"><span class="product-price text-pink"><del class="text-muted">¥59.00</del> ¥52.00</span>
                                            <div class="star-rating"><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i></div>
                                        </div>
                                    </div>
                                    <div class="card-footer bg-transparent border-0">
                                        <div class="product-link d-flex align-items-center justify-content-center">
                                            <button class="btn-cart btn btn-pink mx-3" type="button"><i
                                                    class="las la-shopping-cart mr-1"></i> 加入购物车
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="card product-card card--default"><a class="card-img-hover d-block"
                                                                            href="product-left-image.html"> <img
                                    class="card-img-top card-img-back" src="/mallWeb/static/images/product/p6.jpg"
                                    alt="..."> <img class="card-img-top card-img-front"
                                                    src="/mallWeb/static/images/product/p6_hover.jpg" alt="..."> </a>
                                <div class="card-icons">
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="加入收藏"> <i
                                            class="lar la-heart"></i> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="快速查看"><span
                                            data-target="#quick-view" data-toggle="modal"> <i
                                            class="ion-ios-search-strong"></i></span> </a></div>
                                    <div class="card-icons__item"><a href="#" data-toggle="tooltip"
                                                                     data-placement="left" title=""
                                                                     data-original-title="Compare"> <i
                                            class="las la-random"></i> </a></div>
                                </div>
                                <div class="card-info">
                                    <div class="card-body">
                                        <div class="product-title font-w-5"><a class="link-title"
                                                                               href="product-left-image.html">Trust The
                                            Process</a></div>
                                        <div class="mt-1"><span class="product-price text-pink"><del class="text-muted">¥69.00</del> ¥66.00</span>
                                            <div class="star-rating"><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i><i
                                                    class="las la-star"></i><i class="las la-star"></i></div>
                                        </div>
                                    </div>
                                    <div class="card-footer bg-transparent border-0">
                                        <div class="product-link d-flex align-items-center justify-content-center">
                                            <button class="btn-cart btn btn-pink mx-3" type="button"><i
                                                    class="las la-shopping-cart mr-1"></i> 加入购物车
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!--recent product end-->


</div>

<!--body content end-->


<!--footer start-->

<footer class="py-11 bg-dark-1">
    <div class="container">
        <div class="row">
            <div class="col-12 col-lg-4"><a class="footer-logo text-white h2 mb-0" href="index.html"> <img
                    class="img-fluid" src="/mallWeb/static/images/share/Zync-logo.png" alt=""> </a>
                <p class="my-3 text-muted pr-6">托马斯滴滴吹，但我们不吹，我们致力于把最优质的服务给顾客，把最稳定的机会给商家，把最难攻克的难题留给自己！</p>
                <ul class="list-inline mb-0">
                    <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                            src="/mallWeb/static/images/share/WeChat.png" width="30" height="30"></a></li>
                    <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                            src=".//mallWeb/static/images/share/Moments.png" width="30" height="30"></a></li>
                    <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                            src="/mallWeb/static/images/share/Zhi.png" width="30" height="30"></a></li>
                    <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                            src="/mallWeb/static/images/share/QQ.png" width="30" height="30"></a></li>
                    <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                            src="/mallWeb/static/images/share/Microgoods.png" width="30" height="30"></a></li>
                    <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                            src="/mallWeb/static/images/share/Tik%20Tok.png" width="30" height="30"></a></li>
                </ul>
            </div>
            <div class="col-12 col-lg-8 mt-6 mt-lg-0">
                <div class="row">
                    <div class="col-12 col-sm-4 navbar-white">
                        <h6 class="mb-4 text-white font-w-5">快速连接</h6>
                        <ul class="navbar-nav list-unstyled mb-0">
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="index-2.html">首页</a>
                            </li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                         href="about-us.html">关于我们</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                         href="privacy-policy.html">隐私权政策</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="faq.html">常见问题</a>
                            </li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="goods-detail.html">博客</a>
                            </li>
                            <li class="nav-item"><a class="nav-link text-muted font-w-4" href="contact-us.html">联系我们</a>
                            </li>
                        </ul>
                    </div>
                    <div class="col-12 col-sm-4 mt-6 mt-sm-0 navbar-white">
                        <h6 class="mb-4 text-white font-w-5">资讯</h6>
                        <ul class="navbar-nav list-unstyled mb-0">
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                         href="terms-and-conditions.html">服务条款</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                         href="privacy-policy.html">隐私权政策</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">帮助</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">订单历史</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">您的账号</a></li>
                            <li class="nav-item"><a class="nav-link text-muted font-w-4" href="#">供应商</a></li>
                        </ul>
                    </div>
                    <div class="col-12 col-sm-4 mt-6 mt-sm-0 navbar-white">
                        <h6 class="mb-4 text-white font-w-5">购物指南</h6>
                        <ul class="navbar-nav list-unstyled mb-0">
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">网站导航</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">搜索条件</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">高级搜索</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">退货政策</a></li>
                            <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">我的订单</a></li>
                            <li class="nav-item"><a class="nav-link text-muted font-w-4" href="#">分类查询</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="row pt-9">
            <div class="col-lg-4 col-md-6 col-sm-12">
                <div class="d-flex footer-box">
                    <div class="mr-4"><i class="las la-map-marker-alt ic-2x icon-img"></i></div>
                    <div>
                        <h6 class="mb-1 text-white font-w-5">地址</h6>
                        <p class="mb-0 font-w-4 text-muted">贵州省遵义市红花岗区遵义师范学院
                            新蒲校区</p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4 col-md-6 col-sm-12">
                <div class="d-flex footer-box">
                    <div class="mr-4"><i class="las la-envelope ic-2x icon-img"></i></div>
                    <div>
                        <h6 class="mb-1 text-white font-w-5">邮箱地址</h6>
                        <a class="text-muted font-w-4" href="https://china.nba.com/wizards"> Russ0520@163.com</a><br>
                        <a class="text-muted font-w-4" href="https://china.nba.com/thunder"> 2870088768@qq.com</a></div>
                </div>
            </div>
            <div class="col-lg-4 col-md-12 col-sm-12 mt-md-3 mt-lg-0">
                <div class="d-flex footer-box">
                    <div class="mr-4"><i class="las la-mobile ic-2x icon-img"></i></div>
                    <div>
                        <h6 class="mb-1 text-white font-w-5">24h服务电话</h6>
                        <p class="mb-0 font-w-4 text-muted">以及征求建议电话 <br>
                            +86 1314 520 159 </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="row text-muted align-items-center pt-9">
            <div class="col-md-7 font-w-4"><small>版权：托马斯滴滴吹版权所有.</small></div>
            <div class="col-md-5 text-md-right mt-3 mt-md-0">
                <ul class="list-inline mb-0">
                    <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                   src="/mallWeb/static/images/share/Zhi.png" width="40"
                                                                   height="0"> </a></li>
                    <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                   src="/mallWeb/static/images/share/WeChatPay.png"
                                                                   width="40" height="40"> </a></li>
                    <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                   src="/mallWeb/static/images/share/QuickPass.png"
                                                                   width="40" height="40"> </a></li>
                    <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                   src="/mallWeb/static/images/share/CarPay.png"
                                                                   width="40" height="40"> </a></li>
                </ul>
            </div>
        </div>
    </div>
</footer>

<!--footer end-->

</div>

<!-- page wrapper end -->

<!-- 留言模态框 -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">留言</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form id="isValidator2" method="post">
                    <div class="form-group">

                        回复人:<input value="@" type="text"
                                   style="border: 0;outline: none;background-color: rgba(0, 0, 0, 0);"
                                   readonly="readonly" class="form-control" id="recipient-name">

                    </div>
                    <div class="form-group">
                        <label for="message-text" class="col-form-label">内容:</label>
                        <textarea name="message" class="form-control" id="message-text2" placeholder="感觉怎么样？跟大家分享一下吧!"
                                  rows="4" required data-error="内容不能为空，请输入您的留言"" ></textarea>
                    </div>
                    <div class="modal-footer">
                        <button type="button" id="close" class="btn btn-secondary" data-dismiss="modal">关闭</button>
                        <input type="submit" class="btn-animated btn btn-primary leave_msg" value="留言"/>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Quick View Modal -->
<div class="modal fade view-modal" id="quick-view" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header border-bottom-0 pb-0">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row align-items-center">
                    <div class="col-lg-5 col-12">
                        <img class="img-fluid rounded" src="/mallWeb/static/images/product/large/01.jpg" alt=""/>
                    </div>
                    <div class="col-lg-7 col-12 mt-5 mt-lg-0">
                        <div class="product-details">
                            <h3 class="mb-0">Women Sweater</h3>
                            <div class="star-rating mb-4"><i class="las la-star"></i><i class="las la-star"></i><i
                                    class="las la-star"></i><i class="las la-star"></i><i class="las la-star"></i>
                            </div>
                            <span class="product-price h4">$25.00 <del class="text-muted h6">$35.00</del></span>
                            <ul class="list-unstyled my-4">
                                <li class="mb-2">Availibility: <span class="text-muted"> In Stock</span>
                                </li>
                                <li>Categories :<span class="text-muted"> Women's</span>
                                </li>
                            </ul>
                            <p class="mb-4">Nulla eget sem vitae eros pharetra viverra Nam vitae luctus ligula suscipit
                                risus nec eleifend Pellentesque eu quam sem, ac malesuada</p>
                            <div class="d-sm-flex align-items-center mb-5">
                                <div class="d-flex align-items-center mr-sm-4">
                                    <button class="btn-product btn-product-up"><i class="las la-minus"></i>
                                    </button>
                                    <input class="form-product" type="number" name="form-product" value="1">
                                    <button class="btn-product btn-product-down"><i class="las la-plus"></i>
                                    </button>
                                </div>
                                <select class="custom-select mt-3 mt-sm-0" id="inputGroupSelect01">
                                    <option selected>Size</option>
                                    <option value="1">XS</option>
                                    <option value="2">S</option>
                                    <option value="3">M</option>
                                    <option value="3">L</option>
                                    <option value="3">XL</option>
                                    <option value="3">XXL</option>
                                </select>
                                <div class="d-flex text-center ml-sm-4 mt-3 mt-sm-0">
                                    <div class="form-check pl-0 mr-3">
                                        <input type="radio" class="form-check-input" id="color-filter01" name="Radios">
                                        <label class="form-check-label" for="color-filter01"
                                               data-bg-color="#3cb371"></label>
                                    </div>
                                    <div class="form-check pl-0 mr-3">
                                        <input type="radio" class="form-check-input" id="color-filter02" name="Radios"
                                               checked>
                                        <label class="form-check-label" for="color-filter02"
                                               data-bg-color="#4876ff"></label>
                                    </div>
                                    <div class="form-check pl-0 mr-3">
                                        <input type="radio" class="form-check-input" id="color-filter03" name="Radios">
                                        <label class="form-check-label" for="color-filter03"
                                               data-bg-color="#0a1b2b"></label>
                                    </div>
                                    <div class="form-check pl-0">
                                        <input type="radio" class="form-check-input" id="color-filter04" name="Radios">
                                        <label class="form-check-label" for="color-filter04"
                                               data-bg-color="#f94f15"></label>
                                    </div>
                                </div>
                            </div>
                            <div class="d-sm-flex align-items-center mt-5">
                                <button class="btn btn-primary btn-animated mr-sm-4 mb-3 mb-sm-0"><i
                                        class="las la-shopping-cart mr-1"></i>Add To Cart
                                </button>
                                <a class="btn btn-animated btn-dark" href="#"> <i class="lar la-heart mr-1"></i>Add To
                                    Wishlist</a>
                            </div>
                            <div class="d-sm-flex align-items-center border-top pt-4 mt-5">
                                <h6 class="mb-sm-0 mr-sm-4">Share It:</h6>
                                <ul class="list-inline">
                                    <li class="list-inline-item"><a class="bg-white shadow-sm rounded p-2" href="#"><i
                                            class="la la-facebook"></i></a>
                                    </li>
                                    <li class="list-inline-item"><a class="bg-white shadow-sm rounded p-2" href="#"><i
                                            class="la la-dribbble"></i></a>
                                    </li>
                                    <li class="list-inline-item"><a class="bg-white shadow-sm rounded p-2" href="#"><i
                                            class="la la-instagram"></i></a>
                                    </li>
                                    <li class="list-inline-item"><a class="bg-white shadow-sm rounded p-2" href="#"><i
                                            class="la la-twitter"></i></a>
                                    </li>
                                    <li class="list-inline-item"><a class="bg-white shadow-sm rounded p-2" href="#"><i
                                            class="la la-linkedin"></i></a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<!--back-to-top start-->

<div class="scroll-top"><a class="smoothscroll" href="#top"><i class="las la-angle-up"></i></a></div>

<!--back-to-top end-->

<!-- inject js start -->

<script src="/mallWeb/static/js/jquery-3.5.1.min.js"></script>
<script src="/mallWeb/static/js/popper.min.js"></script>
<script src="/mallWeb/static/js/bootstrap.min.js"></script>
<script src="/mallWeb/static/js/owl.carousel.min.js"></script>
<script src="/mallWeb/static/js/light-slider.js"></script>
<script src="/mallWeb/static/js/parallax.js"></script>
<script src="/mallWeb/static/js/magnific-popup.min.js"></script>
<script src="/mallWeb/static/js/jquery.countdown.min.js"></script>
<script src="/mallWeb/static/js/jquery.dd.min.js"></script>
<script src="/mallWeb/static/js/validator.js"></script>
<script src="/mallWeb/static/js/wow.js"></script>
<script src="/mallWeb/static/js/jquery.elevatezoom.js"></script>
<script src="/mallWeb/static/js/theme-script.js"></script>
<script src="/mallWeb/static/js/mall.js" type="text/javascript"></script>


<script type="text/javascript">

    //提交留言
    $(".comment-reply1").click(function () {

        var Subvalue = $(this).attr("value").split(" ")

        $("#isValidator1").validator()
        $("#isValidator1").on('submit', function (e) {
            if (!e.isDefaultPrevented()) {
                var message = $("#form_message").val()

                $.ajax({
                    type: 'post',
                    url: 'leave_msg?to_user_id=' + Subvalue[0] + '&goods_id=' + Subvalue[1] + '&message=' + message,
                    datatype: 'json',
                    contentType: "application/json",
                    success: function (data) {
                        var leaveMsg = data.leaveMsg
                        layui.use(['layer', 'form', 'jquery'], function () {
                            var layer = layui.layer
                                , form = layui.form
                                , $ = layui.$;

                            layui.use('layer', function () {
                                layer.msg('发表成功', {icon: 1})
                            })
                        })

                        if (Subvalue[2] == "" || Subvalue[2] == null || Subvalue[2] == undefined) {

                            var html = ""
                            html = '<li class="comment_info">' +
                                '<div class="d-flex">' +
                                '<div class="comment_user">' +
                                '<img style="height: 35px;width: 35px" src="/mallWeb/static/images/thumbnail/member3.png" alt="user4">' +
                                '</div>' +
                                '<div class="comment_content">' +
                                '<div class="d-flex">' +
                                '<div class="meta_data">' +
                                '<h6><a href="#">' + leaveMsg.from_user_name + '</a></h6>' +
                                '<div class="comment-time">' + leaveMsg.date + '</div>' +
                                '</div>' +

                                '<div  class="ml-auto">' +
                                /*  */      '<a href="javascript:void(0);"value="' + leaveMsg.parent_id + ' ' + leaveMsg.from_user_id + ' ' + leaveMsg.goods_id + ' ' + leaveMsg.code + ' ' + leaveMsg.code + ' ' + leaveMsg.from_user_name + '" class="comment-reply2"><button style="margin-left: 850px;" type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">回复</button></a>' +
                                '</div>' +

                                '</div>' +
                                '<p>' + leaveMsg.content + '</p>' +
                                '</div>' +
                                '</div>' +
                                '<div style="margin-left: 55px; class="ml-auto">' +
                                '<a class="text-red delete" href="javascript:void(0);"value="' + leaveMsg.code + ' ' + leaveMsg.from_user_id + ' ' + leaveMsg.parent_id + '" >删除</a>' +
                                '</div>' +
                                '<div class="read_more ' + leaveMsg.code + '">' +
                                '</div>' +
                                '<ul id="' + leaveMsg.code + '" class="children" style="display: none">' +
                                '<div id="b' + leaveMsg.code + '">' +
                                '</div>' +
                                '</ul>' +
                                '</li>' +
                                '<hr>'

                            $("#comment_control").append(html)
                        } else {
                            var html = ""
                            html = '<li class="comment_info">' +
                                '<div class="d-flex">' +
                                '<div class="comment_user">' +
                                '<img style="height: 35px;width: 35px" src="/mallWeb/static/images/thumbnail/member3.png" alt="user4">' +
                                '</div>' +
                                '<div class="comment_content">' +
                                '<div class="d-flex">' +
                                '<div class="meta_data">' +
                                '<h6><a href="#">' + leaveMsg.from_user_name + '</a></h6>' +
                                '<div class="comment-time">' + leaveMsg.date + '</div>' +
                                '</div>' +
                                '<div  class="ml-auto">' +
                                '<a href="javascript:void(0);"value="' + leaveMsg.parent_id + ' ' + leaveMsg.from_user_id + ' ' + leaveMsg.goods_id + ' ' + leaveMsg.code + ' ' + leaveMsg.code + ' ' + leaveMsg.from_user_name + '" class="comment-reply2"><button style="margin-left: 850px; type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">回复</button></a>' +
                                '</div>' +
                                '</div>' +
                                '<p>' + leaveMsg.content + '</p>' +
                                '</div>' +
                                '</div>' +
                                '<div style="margin-left: 55px; class="ml-auto">' +
                                '<a class="text-red delete" href="javascript:void(0);"value="' + leaveMsg.code + ' ' + leaveMsg.from_user_id + ' ' + leaveMsg.parent_id + '" >删除</a>' +
                                '</div>' +
                                '<div class="read_more ' + leaveMsg.code + '">' +
                                '</div>' +
                                '<ul id="' + leaveMsg.code + '" class="children" style="display: none">' +
                                '<div id="b' + leaveMsg.code + '">' +
                                '</div>' +
                                '</ul>' +
                                '</li>'

                            $("#comment_control").append(html)
                        }


                    },
                    error: function () {
                        layui.use('layer', function () {
                            layer.msg('服务器正忙，请刷新重试', {icon: 5})
                        })
                    }
                })
            }
            return false;
        })
    })


</script>
<script type="text/javascript">

    //点击展开
    $(document).on('click', '.muted', function () {
        var value = $(this).parent().attr("value").split(" ")
        var text = $(this).parent().text().split("")
        if (text[0] == "展") {

            $.ajax({

                type: "POST",
                url: "showchildren?parent_id=" + value[1],
                datatype: 'json',
                contentType: "application/json",
                success: function (data) {
                    var length = data.childMsg.length - 1
                    var childLast = data.childLast

                    var html1 = ""
                    $.each(data.childMsg, function (index, childMsg) {
                        if (index != 0) {
                            if (index == length) {
                                html1 += '<div id="f' + childLast.code + '">'
                            }
                            html1 += '<li class="comment_info">' +
                                '<div class="d-flex">' +
                                '<div class="comment_user">' +
                                '<img style="height: 35px;width: 35px" src="/mallWeb/static/images/thumbnail/member2.png" alt="user3">' +
                                '</div>' +
                                '<div class="comment_content">' +
                                '<div class="d-flex align-items-md-center">' +
                                '<div class="meta_data">' +
                                '<h6><a href="#">' + childMsg.from_user_name + '回复' + childMsg.to_user_name + '</a></h6>' +
                                '<div class="comment-time">' + childMsg.date + '</div>' +

                                '</div>' +
                                '<div class="ml-auto">' +

                                '<a href="javascript:void(0);"value="' + childMsg.parent_id + ' ' + childMsg.from_user_id + ' ' + childMsg.goods_id + ' ' + childMsg.code + ' ' + childLast.code + ' ' + childMsg.from_user_name + '" class="comment-reply2"><button style="margin-left: 750px" type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">回复</button></a>' +

                                '</div>' +

                                '</div>' +
                                '<p>' + childMsg.content + '</p>' +
                                '</div>' +
                                '</div>' +

                                '<div style="margin-left: 55px; class="ml-auto">' +
                                '<a class="text-red delete" href="javascript:void(0);"value="' + childMsg.code + ' ' + childMsg.from_user_id + ' ' + childMsg.parent_id + '" >删除</a>' +
                                '</div>' +

                                '</li>'
                            if (length == index) {
                                html1 += '</div>'
                            }
                            html1 += '<hr>'
                        }
                    })


                    $(".children").html(html1)
                },
                error: function () {
                    layui.use('layer', function () {
                        layer.msg('服务器正忙，请刷新重试', {icon: 5})
                    })
                }
            })

            var html2 =
                '<a href="javascript:void(0);"value="' + value[0] + ' ' + value[1] + '"><span class="text-muted muted" style="margin-left: 1050px">' + "收起" +
                '<i class="bi bi-chevron-up"></i></span></a>'

            $("." + value[0]).html(html2)
            $("#" + value[0]).toggle()
        } else {

            $.ajax({

                type: "POST",
                url: "showchildren?parent_id=" + value[1],
                datatype: 'json',
                contentType: "application/json",
                success: function (data) {
                    var length = data.childMsg.length - 1


                    var html = '<a href="javascript:void(0);"value="' + value[0] + ' ' + value[1] + '"><span class="text-muted muted" style="margin-left: 1000px">' + "展开" + length + "条回复" +
                        '<i class="bi bi-chevron-down"></i></span></a>'

                    $("." + value[0]).html(html)
                    $("#" + value[0]).toggle()

                },
                error: function () {
                    layui.use('layer', function () {
                        layer.msg('服务器正忙，请刷新重试', {icon: 5})
                    })
                }
            })

        }

    })

</script>


<script type="text/javascript">

    //弹窗留言
    $(document).on("click", ".comment-reply2", function () {

        var valueWin = $(this).attr("value")
        localStorage.setItem("valueWin", valueWin)
        var Win = valueWin.split(" ")
        $("#recipient-name").attr({"value": "@" + Win[5]})
        $(".leave_msg").click(function () {

            $("#isValidator2").validator()
            $("#isValidator2").on('submit', function (e) {
                value = localStorage.getItem("valueWin").split(" ")


                var message = $("#message-text2").val()
                if (!e.isDefaultPrevented()) {
                    $.ajax({
                        type: 'post',
                        url: 'leave_msg?parent_id=' + value[0] + '&to_user_id=' + value[1] + '&goods_id=' + value[2] + '&parent_code=' + value[3] + '&message=' + message,
                        contentType: "application/json",
                        datatype: 'json',
                        success: function (data) {

                            var childLast = data.childLast

                            if (data.parentMsg != null || data.parentMsg != undefined) {
                                var html = ""

                                $.each(data.parentMsg, function (index, parentMsg) {
                                    var length = parentMsg.childMsg.length - 1
                                    if (childLast == length) {
                                        html += '<div id="f' + childLast.code + '">'
                                    }
                                    html += '<li class="comment_info">' +
                                        '<div class="d-flex">' +
                                        '<div class="comment_user">' +
                                        '<img style="height: 35px;width: 35px" src="/mallWeb/static/images/thumbnail/member3.png" alt="user4">' +
                                        '</div>' +
                                        '<div class="comment_content">' +
                                        '<div class="d-flex">' +
                                        '<div class="meta_data">' +
                                        '<h6><a href="#">' + parentMsg.from_user_name + ' </a></h6>' +
                                        '<div class="comment-time">' + parentMsg.date + '</div>' +
                                        '</div>' +
                                        '<div  class="ml-auto">' +
                                        '<a href="javascript:void(0);"value="' + parentMsg.parent_id + ' ' + parentMsg.from_user_id + ' ' + parentMsg.goods_id + ' ' + parentMsg.code + ' ' + childLast.code + ' ' + parentMsg.form_user_name + '" class="comment-reply2"><button style="margin-left: 850px; type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">回复</button></a>' +
                                        '</div>' +
                                        '</div>' +
                                        '<p>' + parentMsg.content + '</p>' +
                                        '</div>' +
                                        '</div>' +
                                        '<br>' +
                                        '<div style="margin-left: 55px; class="ml-auto">' +
                                        '<a class="text-red delete" href="javascript:void(0);"value="' + parentMsg.code + ' ' + parentMsg.from_user_id + ' ' + parentMsg.parent_id + '" >删除</a>' +
                                        '</div>' +

                                        '<div class="read_more ' + parentMsg.code + '">'
                                    if (length > 0) {
                                        html += '<a href="javascript:void(0);" value="' + parentMsg.code + ' ' + parentMsg.parent_id + '"><span style="margin-left: 1000px" class="text-muted muted c' + parentMsg.code + '">展开' + length + '条回复<i class="bi bi-chevron-down"></i></span></a>'
                                    }
                                    html += '</div>' +
                                        '<ul id="' + parentMsg.code + '" class="children" style="display: none">' +
                                        '<div id="b' + parentMsg.code + '">' +
                                        <!-- 子评论 -->
                                        '</div>' +
                                        '</ul>' +
                                        '</li>'
                                    if (index = length) {
                                        '</div>'
                                    }
                                    '<hr>'
                                })
                                $("#comment_control").html(html)
                            } else {
                                var leaveMsg = data.leaveMsg

                                var html2 = '<div id="b' + childLast.code + '">' +
                                    '<li class="comment_info">' +
                                    '<div class="d-flex">' +
                                    '<div class="comment_user">' +
                                    '<img style="height: 35px;width: 35px" src="/mallWeb/static/images/thumbnail/member2.png" alt="user3">' +
                                    '</div>' +
                                    '<div class="comment_content">' +
                                    '<div class="d-flex align-items-md-center">' +
                                    '<div class="meta_data">' +
                                    '<h6><a href="#">' + leaveMsg.from_user_name + '回复' + leaveMsg.to_user_name + '</a></h6>' +
                                    '<div class="comment-time">' + leaveMsg.date + '</div>' +
                                    '</div>' +

                                    '<div class="ml-auto">' +
                                    '<a href="javascript:void(0);"value="' + leaveMsg.parent_id + ' ' + leaveMsg.from_user_id + ' ' + leaveMsg.goods_id + ' ' + leaveMsg.code + ' ' + childLast.code + ' ' + leaveMsg.from_user_name + '" class="comment-reply2"><button style="margin-left: 750px; type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">回复</button></a>' +
                                    '</div>' +

                                    '</div>' +
                                    '<p>' + leaveMsg.content + '</p>' +
                                    '</div>' +
                                    '</div>' +

                                    '<div style="margin-left: 55px; class="ml-auto">' +
                                    '<a class="text-red delete" href="javascript:void(0);"value="' + leaveMsg.code + ' ' + leaveMsg.from_user_id + ' ' + leaveMsg.parent_id + '" >删除</a>' +
                                    '</div>' +

                                    '</li>' +
                                    '</div>'
                            }
                            $(".children").append(html2)

                            $("#close").click()
                        },
                        error: function () {
                            layui.use('layer', function () {
                                layer.msg('服务器正忙，请刷新重试', {icon: 5})
                            })
                        }
                    })


                }
                return false;
            })

        })

    })
</script>
<!-- 删除 -->
<script type="text/javascript">

    $(document).on('click', '.delete', function () {

        var del = $(this).attr("value").split(" ")

        $.ajax({
            url: "delete_Msg?code=" + del[0] + "&from_user_id=" + del[1] + "&parent_id=" + del[2],
            type: 'POST',
            contentType: "application/json",
            datatype: 'json',
            success: function (data) {


                if (data.parentMsg != null || data.parentMsg != undefined) {
                    var childLast = data.childLast
                    var html = ""

                    $.each(data.parentMsg, function (index, parentMsg) {
                        var length = parentMsg.childMsg.length - 1
                        if (childLast == length) {
                            html += '<div id="f' + childLast.code + '">'
                        }
                        html += '<li class="comment_info">' +
                            '<div class="d-flex">' +
                            '<div class="comment_user">' +
                            '<img style="height: 35px;width: 35px" src="/mallWeb/static/images/thumbnail/member3.png" alt="user4">' +
                            '</div>' +
                            '<div class="comment_content">' +
                            '<div class="d-flex">' +
                            '<div class="meta_data">' +
                            '<h6><a href="#">' + parentMsg.from_user_name + ' </a></h6>' +
                            '<div class="comment-time">' + parentMsg.date + '</div>' +
                            '</div>' +
                            '<div  class="ml-auto">' +
                            '<a href="javascript:void(0);"value="' + parentMsg.parent_id + ' ' + parentMsg.from_user_id + ' ' + parentMsg.goods_id + ' ' + parentMsg.code + ' ' + childLast.code + ' ' + parentMsg.from_user_name + '" class="comment-reply2"><button style="margin-left: 850px; type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">回复</button></a>' +
                            '</div>' +
                            '</div>' +
                            '<p>' + parentMsg.content + '</p>' +
                            '</div>' +
                            '</div>' +
                            '<br>' +
                            '<div style="margin-left: 55px; class="ml-auto">' +
                            '<a class="text-red delete" href="javascript:void(0);"value="' + parentMsg.code + ' ' + parentMsg.from_user_id + ' ' + parentMsg.parent_id + '" >删除</a>' +
                            '</div>' +

                            '<div class="read_more ' + parentMsg.code + '">'
                        if (length > 0) {
                            html += '<a href="javascript:void(0);" value="' + parentMsg.code + ' ' + parentMsg.parent_id + '"><span style="margin-left: 1000px" class="text-muted muted c' + parentMsg.code + '">展开' + length + '条回复<i class="bi bi-chevron-down"></i></span></a>'
                        }
                        html += '</div>' +
                            '<ul id="' + parentMsg.code + '" class="children" style="display: none">' +
                            '<div id="b' + parentMsg.code + '">' +
                            <!-- 子评论 -->
                            '</div>' +
                            '</ul>' +
                            '</li>'
                        if (index = length) {
                            '</div>'
                        }
                        '<hr>'
                    })
                    $("#comment_control").html(html)

                    layui.use('layer', function () {
                        layer.msg('您已删除成功', {icon: 1})
                    })


                } else {

                    layui.use('layer', function () {
                        layer.msg('该留言不是您的不能删除', {icon: 5})
                    })
                }
            },
            error: function () {
                layui.use('layer', function () {
                    layer.msg('服务器忙碌，请刷新重试', {icon: 5})
                })
            }
        })


    })

</script>
<script type="text/javascript">
    $(function () {
        helangSearch.init();
    })
</script>
<script type="text/javascript">
    /* 搜索 */
    var helangSearch = {


        /* 元素集 */
        els: {},
        /* 搜索类型序号 */
        searchIndex: 0,
        /* 火热的搜索列表 */
        hot: {
            /* 颜色 */
            color: ['#ff2c00', '#ff5a00', '#ff8105', '#fd9a15', '#dfad1c', '#6bc211', '#3cc71e', '#3cbe85'],
            /* 列表 */
            list: [
                $(".pickListModels").val(),
                $(".pickListModels").next().val(),
                $(".pickListModels").next().next().val(),
                $(".pickListModels").next().next().next().val(),
                $(".pickListModels").next().next().next().next().val(),
                $(".pickListModels").next().next().next().next().next().val(),
                $(".pickListModels").next().next().next().next().next().next().val(),
                $(".pickListModels").next().next().next().next().next().next().next().val()
            ]
        },
        /* 初始化 */
        init: function () {
            var _this = this;
            this.els = {
                pickerBtn: $(".picker"),
                pickerList: $(".picker-list"),
                logo: $(".logo"),
                hotList: $(".hot-list"),
                input: $("#search-input"),
                button: $(".search")
            };

            /* 注册事件 */
            /* 搜索类别选择按钮 */
            this.els.pickerBtn.click(function () {
                if (_this.els.pickerList.is(':hidden')) {
                    setTimeout(function () {
                        _this.els.pickerList.show();
                    }, 100);
                }
            });
            /* 搜索类别选择列表 */
            this.els.pickerList.on("click", ">li", function () {
                _this.els.logo.css("background-image", ('url(img/' + $(this).data("logo") + ')'));
                _this.searchIndex = $(this).index();
                _this.els.pickerBtn.html($(this).html())
            });
            /* 搜索 输入框 点击*/
            this.els.input.click(function () {
                if (!$(this).val()) {
                    setTimeout(function () {
                        _this.els.hotList.show();
                    }, 100);
                }
            });
            /* 搜索 输入框 输入*/
            this.els.input.on("input", function () {
                if ($(this).val()) {
                    _this.els.hotList.hide();
                }
            });

            /* 设置热门搜索列表 */
            if (_this.searchIndex == 0) {
                this.els.hotList.html(function () {
                    var str = '';
                    $.each(_this.hot.list, function (index, content) {
                        str += '<a href="product-1?content=' + content + '" >'
                            + '<div class="number" style="color: ' + _this.hot.color[index] + '">' + (index + 1) + '</div>'
                            + '<div>' + content + '</div>'
                            + '</a>';
                    });
                    return str;
                });

            }
            /* 搜索按钮 */
            this.els.button.click(function () {
                /*
            	*icon
            	*1为勾勾
            	*2为叉叉
            	*3为问号
            	*4为锁
            	*5为难过表情
            	*6为笑脸表情
            	*7为感叹号
            	*最多为7不能再多了
            	*/
                //var searchArr=['商品','店铺','用户','博客'];
                if (_this.els.input.val() == "") {
                    layui.use(['layer', 'form', 'jquery'], function () {
                        var layer = layui.layer
                            , form = layui.form
                            , $ = layui.$;

                        layui.use('layer', function () {
                            layer.msg('内容不能为空', {icon: 6})
                        })

                    })

                } else {
                    //跳转到商品
                    if (_this.searchIndex == 0) {
                        $.ajax({
                            type: "POST",
                            url: "search-1?content=" + _this.els.input.val(),
                            contentType: "application/json",
                            data: {
                                //"content":_this.els.input.val()
                            },
                            datatype: 'json',
                            error: function () {
                                alert("error")
                                return false;
                            },
                            success: function (data) {
                                if (data.success != null) {
                                    window.location.href = "product-1?content=" + _this.els.input.val()
                                } else if (data.nosearch != null) {
                                    layui.use('layer', function () {
                                        layer.msg('您搜索的内容不存在，请重新搜索', {icon: 3})
                                    })
                                }
                            }
                        })
                        //window.location.href="product-1?content="+_this.els.input.val()
                    }
                    //跳转到店铺
                    else if (_this.searchIndex == 1) {
                        window.location.href = "goods-1"
                    }
                    //跳转到用户
                    else if (_this.searchIndex == 2) {
                        window.location.href = "goods-1"
                    }
                    //跳转到博客
                    else if (_this.searchIndex == 3) {
                        window.location.href = "goods-1"
                    }
                }
            });
            /* 文档 */
            $(document).click(function () {
                _this.els.pickerList.hide();
                _this.els.hotList.hide();
            });
            /* 搜索按钮 */
        }

    };

</script>

<!-- inject js end -->

</body>
</html>
